<template>
  <a-modal
    :title="title"
    :visible="visible"
    :dialog-style="{ top: '20px' }"
    :confirm-loading="loading"
    width="1000px"
    @ok="handleOk"
    @cancel="handleCancel"
  >
    <a-tabs type="card" @change="changeTabs" defaultActiveKey="S">
      <a-tab-pane key="S" tab="提交">
        <submit-task :task-node="taskNode" ref="submitTask" />
      </a-tab-pane>
      <a-tab-pane key="D" tab="委托" :disabled="delegateDisable ">
        <delegate-task :task-node="taskNode" ref="delegateTask" />
      </a-tab-pane>
      <a-tab-pane key="T" tab="转办" :disabled="turnToDoDisable">
        <turn-to-do-task :task-node="taskNode" ref="turnToDoTask" />
      </a-tab-pane>
    </a-tabs>
  </a-modal>
</template>
<script>
import { mapGetters } from 'vuex'
import SubmitTask from '@/components/flowable/task/submitTask.vue'
import DelegateTask from '@/components/flowable/task/delegateTask.vue'
import TurnToDoTask from '@/components/flowable/task/turnToDoTask.vue'

export default {
  name: 'TaskModal',
  components: { TurnToDoTask, DelegateTask, SubmitTask },
  props: {
    // 操作类型
    submitType: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      // 弹框显示
      visible: false,
      // 弹框遮罩
      loading: false,
      // 标题
      title: '',
      // 任务下一节点
      taskNode: {},
      // 不可操作
      delegateDisable: false,
      turnToDoDisable: false,
      // 操作类型
      operateType: 'S'
    }
  },
  watch: {},
  computed: {
    ...mapGetters(['userId', 'deptId'])
  },
  methods: {
    // 显示弹框
    show (data) {
      this.visible = true
      this.taskNode = data
      this.delegateDisable = data.submitTypes.indexOf('D') === -1
      this.turnToDoDisable = data.submitTypes.indexOf('T') === -1
    },
    // 隐藏弹框
    hide () {
      this.visible = false
    },
    // 处理任务
    handleOk () {
      let data
      if (this.operateType === 'S') {
        data = this.$refs.submitTask.submitTaskData()
      }
      if (this.operateType === 'D') {
        data = this.$refs.delegateTask.delegateTaskData()
      }
      if (this.operateType === 'T') {
        data = this.$refs.turnToDoTask.turnToDoTaskData()
      }
      if (data) {
        this.$emit('submitOk', data)
      }
    },
    // 关闭弹框
    handleCancel () {
      this.visible = false
    },
    // tab切换
    changeTabs (key) {
      this.operateType = key
    }
  },
  created () {
  },
  mounted () {
  }
}
</script>
